<template>
    <div class="Text">
        <el-popover
            placement="bottom"
            width="300"
            trigger="manual"
            v-model="visible">
            <div>
                <!-- 主地址 -->
                <p><b>apiUrl：</b>{{apiUrl}}</p>
                <hr>
                <!-- 菜单 -->
                <p><b>menu：</b>{{curMenu}}</p>
                <p><b>subMenu：</b>{{curSubMenu}}</p>
                <p><b>region：</b>{{curRegion}}</p>
                <hr>
                <!-- 选项 -->
                
            </div>
            <el-button class="test-popover-btn" slot="reference" @click="visible = !visible">调试</el-button>
        </el-popover>

        <!-- <el-collapse>
            <el-collapse-item>
                <div>
                    <p>请求主地址</p>
                    <p>{{apiUrl}}</p>
                </div>

                <div>
                    <p>一级菜单</p>
                    <p>{{curMenu}}</p>
                </div>

                <div>
                    <p>二级菜单</p>
                    <p>{{curSubMenu}}</p>
                </div>

                <h3>{{apiUrl}}scale={{curGetOptions.scale}}&date={{curGetOptions.date}}&hour={{curGetOptions.hour}}&code={{curGetOptions.code}}</h3>
                <hr>
                <h3>key : {{curGetMenuUrl.menu}} ,    value : {{defaultMenu}}</h3>
                <h3>key : {{curGetMenuUrl.submenu}} ,   value : {{curSubMenuActive}}</h3>
                <h3>{{curGetPjKeyVal}}</h3>
                <h3>mapdraw ：{{curMapDrawUrl}}</h3>
                <h3>date : {{curGetOptions.date}}</h3>
                <h3>hour : {{curGetOptions.hour}}</h3>
                <h3>xz : {{curGetOptions.scale}}</h3>
                <h3>code : {{curGetOptions.code}}</h3>
                <h3>key : {{curGetOptions.key}}</h3>
                <h3>name : {{curGetOptions.name}}</h3>
            </el-collapse-item>
        </el-collapse> -->

    </div>
</template>

<script>
export default {
    data() {
      return {
        visible: false
      };
    },
    computed:{
        // 主地址
        apiUrl(){
            return this.$store.getters.apiUrl
        },
        // 一级菜单
        curMenu(){
            return this.$store.getters.curMenu[this.$store.getters.defaultMenu - 1]
        },
        // 二级菜单
        curSubMenu(){
            return this.$store.getters.curSubMenu[this.$store.getters.curSubMenuActive - 1]
        },
        // 当前地区
        curRegion(){
            return this.$store.getters.curRegion
        },



        // 二级菜单
        // curGetMenuUrl(){
        //     return this.$store.getters.curGetMenuUrl
        // },
        // curGetPjKeyVal(){
        //     let pjArr = []
        //     let val = this.$store.getters.curPjmenu.pjmenu
        //     let newval = val.substring(0,val.length-1).split('&')
        //     newval.map(function(ele){
        //         pjArr.push({key:ele.split("=")[0],value:ele.split("=")[1]})
        //     })
        //     return pjArr
        // },
        curGetOptions(){
            return this.$store.getters.curGetOptions
        },
        curMapDrawUrl(){
            return this.$store.getters.curMapDrawUrl
        },
        curSubMenuActive(){
            return this.$store.getters.curSubMenuActive
        },
        curBtnGroupActive(){
            return this.$store.getters.curBtnGroupActive
        },
        curDropGroupActive(){
            return this.$store.getters.curDropGroupActive
        }
    }
}
</script>

<style scope lang="stylus">
.Text
    .el-dropdown-link
        color #aaa

.test-popover-btn
    margin-top 5px
</style>

